<template>
  <!-- 新增类型dialog -->
  <Edialog :title="title" :outershow="show" @close="closeFn()">
    <div style="padding: 0 20px">
      <el-form ref="form" :model="form" label-width="70px" :rules="rules">
        <el-form-item label="分组">
          <el-input v-model="form.groupName" disabled></el-input>
        </el-form-item>
        <el-form-item prop="contactsName" label="联系人">
          <el-input v-model="form.contactsName" placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item prop="contactsMobile" label="手机号">
          <el-input
            v-model="form.contactsMobile"
            placeholder="请输入"
          ></el-input>
        </el-form-item>
        <el-form-item label="备注">
          <el-input
            v-model="form.contactsNotes"
            placeholder="请输入"
          ></el-input>
        </el-form-item>
      </el-form>
      <div class="daj">
        <el-button @click="saveFn(1)" type="primary" v-if="title == '新增'"
          >保存并继续添加</el-button
        >
        <el-button @click="saveFn()" type="primary">保存</el-button>
        <el-button @click="closeFn()">关 闭</el-button>
      </div>
    </div>
  </Edialog>
</template>

<script>
import Edialog from '@/components/Edialog'
import { fd } from '@/utils/index'
import { putBsContacts, postBsContacts } from '@/api/smsManage/groupContacts'
export default {
  components: {
    Edialog
  },
  data () {
    return {
      title: '',
      show: false,
      form: {
        groupName: '',
        contactsName: '',
        contactsMobile: '',
        contactsNotes: '',
        id: '',
        groupId: ''
      },
      rules: {
        contactsName: [{ required: true, message: '请输入', trigger: 'blur' }],
        contactsMobile: [{ required: true, message: '请输入', trigger: 'blur' }]
      }
    }
  },
  methods: {
    open (scope) {
      this.form.groupName = scope.groupName
        ? scope.groupName
        : '未分组（默认分组）'
      this.form.groupId = scope.groupId ? scope.groupId : ''
      if (!scope.id) {
        this.title = '新增'
      } else {
        this.title = '修改'
        this.form.contactsNotes = scope.contactsNotes
        this.form.contactsName = scope.contactsName
        this.form.contactsMobile = scope.contactsMobile
        this.form.id = scope.id
      }
      this.show = true
    },
    // 保存事件
    saveFn (val) {
      this.$refs.form.validate(async valid => {
        if (valid) {
          let res
          if (this.title == '新增') {
            res = await putBsContacts(fd(this.form))
          } else {
            res = await postBsContacts(fd(this.form))
          }
          if (res.data && res.data.bcode == 0) {
            this.$parent.getTabelDataFn()
            this.closeFn(val)
            this.$message.success(res.data.bmsg)
          }
        }
      })
    },
    closeFn (val) {
      this.form.contactsName = ''
      this.form.contactsMobile = ''
      this.form.contactsNotes = ''
      this.$refs.form.clearValidate()
      if (!val) {
        this.form.groupName = ''
        this.form.groupId = ''
        this.form.id = ''
        this.show = false
      }
    }
  }
}
</script>

<style scoped lang="scss"></style>
